/*
* Created by: yyf
* Description: 台账查询--已设立基金列表
*/
<template>
    <div>
        <div class="right">
            <el-tabs type="border-card" v-model="tabIndex" class="ca-tabs">
                <el-tab-pane label="已投资项目" :disabled="!isAuthItemSee">
                    <div class="ca-box-border-top-none ca-p-22">
                        <el-form ref="form" label-width="110px">
                            <el-row>
                                <el-col :span="5">
                                    <el-form-item label="投资阶段">
                                        <el-select v-model="projectParam.prostatus">
                                            <el-option v-for="item in initView.prostatusList"
                                                       :label="item.name"
                                                       :value="item.id"
                                                       :key="item.id">
                                            </el-option>
                                        </el-select>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="5" :offset="1">
                                    <el-form-item label="行业分类">
                                        <el-select v-model="projectParam.industry">
                                            <el-option v-for="item in initView.industryList "
                                                       :label="item.name"
                                                       :value="item.id"
                                                       :key="item.id">
                                            </el-option>
                                        </el-select>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <el-row>
                                <el-col :span="5">
                                    <el-form-item label="项目名称">
                                        <el-select v-model="projectName" @change="changeProject" filterable>
                                            <el-option v-for="item in initView.projectID_List "
                                                       :label="item.itemName"
                                                       :value="item.itemId"
                                                       :key="item.id">
                                            </el-option>
                                        </el-select>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="17" class="ca-p-t-7" :offset="1">
                                    <el-tag
                                        class="ca-m-r-5 ca-m-b-5"
                                        v-for="(tag,idx) in projectTagList"
                                        :closable="true"
                                        type="primary"
                                        :key="idx"
                                        @close="handleCloseItem(tag, idx)">
                                        {{tag.itemName}}
                                    </el-tag>
                                </el-col>
                            </el-row>
                            <el-row class="ca-align-center">
                                <el-button type="primary" @click="getProjectData()">查询</el-button>
                                <el-button type="primary" @click="exportExcelItem(21)" :disabled="!isAuthItemDownload">下载</el-button>
                            </el-row>
                            <el-row class="ca-align-center ca-m-t-20">
                                <span class="ca-m-r-20">注：本表格所有金额单位为：万元</span>
                                <span class="ca-m-l-20">股数单位为：万股</span>
                            </el-row>
                        </el-form>
                    </div>
                    <div class="ca-box ca-p-22 ca-m-t-15">
                        <el-table :data="projectData" border class="table_p_01 ca-table">
                            <el-table-column label="序号" align="center">
                                <template slot-scope="scope">
                                    {{scope.$index+1}}
                                </template>
                            </el-table-column>
                            <el-table-column label="项目名称"  prop="itemName" show-overflow-tooltip></el-table-column>
                            <el-table-column label="项目所属地区"  prop="registeredAddress" show-overflow-tooltip></el-table-column>
                            <el-table-column label="投资基金"  prop="fundName" show-overflow-tooltip></el-table-column>
                            <el-table-column label="投资日期"  prop="investDate" width="90px">
                                <template slot-scope="scope">
                                    {{scope.row.investDate ? $moment(scope.row.investDate).format('YYYY-MM-DD') : ''}}
                                </template>
                            </el-table-column>
                            <el-table-column label="项目经理"  prop="voteAfterUserNames" show-overflow-tooltip></el-table-column>
                            <el-table-column label="投资规模"  prop="investAmount" show-overflow-tooltip>
                                <template slot-scope="scope">
                                    {{scope.row.investAmount | format1}}
                                </template>
                            </el-table-column>
                            <el-table-column label="占股比例"  prop="holdScale" show-overflow-tooltip>
                                <template slot-scope="scope">
                                    {{scope.row.holdScale * 100 | format1}}%
                                </template>
                            </el-table-column>
                            <el-table-column label="投后估值"  prop="valuationAfter" show-overflow-tooltip>
                                <template slot-scope="scope">
                                    {{scope.row.valuationAfter | format1}}
                                </template>
                            </el-table-column>
                            <el-table-column label="注册资本"  prop="registeredCapital" show-overflow-tooltip>
                                <template slot-scope="scope">
                                    {{scope.row.registeredCapital | format1}}
                                </template>
                            </el-table-column>
                            <el-table-column label="投资阶段"  prop="prostatusName"></el-table-column>
                            <el-table-column label="项目领域"  prop="industryName"></el-table-column>
                            <el-table-column label="是否退出(全部/部分)"  prop="exit"></el-table-column>
                            <el-table-column label="退出方式"  prop="exitEntityNames" show-overflow-tooltip></el-table-column>
                            <el-table-column label="退出金额"  prop="exitAmount" show-overflow-tooltip>
                                <template slot-scope="scope">
                                    {{scope.row.exitAmount | format1}}
                                </template>
                            </el-table-column>
                        </el-table>
                    </div>
                </el-tab-pane>
                <el-tab-pane label="已设立基金" :disabled="!isAuthFundsSee">
                    <div class="ca-box-border-top-none ca-p-22">
                        <el-form ref="form" label-width="80px">
                            <el-row>
                                <el-form-item label="成立时间">
                                    <el-date-picker v-model="investFundsParam.startTime" type="date" placeholder="选择开始日期"></el-date-picker>
                                    <el-date-picker v-model="investFundsParam.endTime" type="date" placeholder="选择结束日期"></el-date-picker>
                                </el-form-item>
                            </el-row>
                            <el-row>
                                <el-col :span="5">
                                    <el-form-item label="基金名称">
                                        <el-select v-model="fundName" @change="changeFund" filterable>
                                            <el-option v-for="item in initView.fundID_List"
                                                       :label="item.fundName"
                                                       :value="item.id"
                                                       :key="item.id">
                                            </el-option>
                                        </el-select>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="17" class="ca-p-t-7" :offset="1">
                                    <el-tag
                                        v-for="(item, index) in fundIdList"
                                        :key="item.id"
                                        closable
                                        :disable-transitions="false"
                                        class="ca-m-r-5 ca-m-b-5"
                                        @close="handleCloseFunds(item, index)">
                                        {{item.fundName}}
                                    </el-tag>
                                </el-col>
                            </el-row>
                            <el-row>
                                <el-col :span="24" class="ca-align-center">
                                    <!--<button type="button" @click="getInvestFundsList" class="ca-btn ca-btn-default ca-tp-8"><i class="fa fa-search ca-m-r-5"></i><span>查询</span></button>-->
                                    <el-button type="primary" class="ca-advanced-btn" @click="getInvestFundsList()">查询</el-button>
                                </el-col>
                            </el-row>
                            <el-row class="ca-align-center ca-m-t-20">
                                <span class="ca-m-r-10">注：本表格所有金额单位为：万元</span>
                                <span class="ca-m-l-10">股数单位为：万股</span>
                            </el-row>
                        </el-form>
                    </div>
                    <div class="ca-box ca-p-22 ca-m-t-15">
                        <el-row>
                            <div class="ca-table-header">
                                <span>1、基金基本信息</span>
                                <!--<el-button type="button" @click="exportExcel(15)" :disabled="!isAuthFundsDownload" class="ca-btn ca-btn-default ca-tp-8 ca-m-l-10">-->
                                    <!--<i class="fa fa-download "></i>-->
                                    <!--<span>下载</span>-->
                                <!--</el-button>-->
                                <el-button type="primary" size="small" @click="exportExcel(15)" :disabled="!isAuthFundsDownload" class="ca-m-l-10">下载</el-button>
                            </div>
                            <el-table :data="ledgerFundBaseList" border class="table_p_01 ca-table">
                                <el-table-column label="序号" align="center">
                                    <template slot-scope="scope">{{scope.$index+1}}</template>
                                </el-table-column>
                                <el-table-column label="基金名称"  prop="fundName" show-overflow-tooltip></el-table-column>
                                <el-table-column label="基金成立时间"  prop="estTime"></el-table-column>
                                <el-table-column label="基金规模"  prop="scale" show-overflow-tooltip>
                                    <template slot-scope="scope">
                                        {{scope.row.scale | format1}}
                                    </template>
                                </el-table-column>
                                <el-table-column label="基金续存期"  prop="duration" show-overflow-tooltip></el-table-column>
                                <el-table-column label="已投金额"  prop="amountInvested" show-overflow-tooltip>
                                    <template slot-scope="scope">
                                        {{scope.row.amountInvested | format1}}
                                    </template>
                                </el-table-column>
                                <el-table-column label="已投项目数"  prop="haveCast"></el-table-column>
                                <el-table-column label="基金注册地"  prop="place" show-overflow-tooltip></el-table-column>
                                <el-table-column label="基金形式"  prop="fundForm">
                                    <template slot-scope="scope">
                                        {{scope.row.fundForm | getNameById('fundForm')}}
                                    </template>
                                </el-table-column>
                                <el-table-column label="执行事务合伙人"  prop="partnerName" show-overflow-tooltip></el-table-column>
                            </el-table>
                        </el-row>
                        <el-row class="ca-m-t-20">
                            <div class="ca-table-header">
                                <span>2、基金财务信息</span>
                                <el-button type="primary" size="small" @click="exportExcel(16)" :disabled="!isAuthFundsDownload" class="ca-m-l-10">下载</el-button>
                            </div>
                            <el-table :data="ledgerFundFinanceList" border class="table_p_01 ca-table">
                                <el-table-column label="序号" align="center">
                                    <template slot-scope="scope">{{scope.$index+1}}</template>
                                </el-table-column>
                                <el-table-column label="基金名称"  prop="fundName" show-overflow-tooltip></el-table-column>
                                <el-table-column label="基金实缴规模"  prop="paid" show-overflow-tooltip>
                                    <template slot-scope="scope">
                                        {{scope.row.paid | format1}}
                                    </template>
                                </el-table-column>
                                <el-table-column label="累积理财收益"  prop="profit" show-overflow-tooltip>
                                    <template slot-scope="scope">
                                        {{scope.row.profit | format1}}
                                    </template>
                                </el-table-column>
                                <el-table-column label="累积投资总额"  prop="amountInvested" show-overflow-tooltip>
                                    <template slot-scope="scope">
                                        {{scope.row.amountInvested | format1}}
                                    </template>
                                </el-table-column>
                                <el-table-column label="累积费用总额"  prop="expenditure" show-overflow-tooltip>
                                    <template slot-scope="scope">
                                        {{scope.row.expenditure | format1}}
                                    </template>
                                </el-table-column>
                                <el-table-column label="累积项目退出及分红"  prop="investLoan" show-overflow-tooltip>
                                    <template slot-scope="scope">
                                        {{scope.row.investLoan | format1}}
                                    </template>
                                </el-table-column>
                                <el-table-column label="累积项目分配"  prop="amount" show-overflow-tooltip>
                                    <template slot-scope="scope">
                                        {{scope.row.amount | format1}}
                                    </template>
                                </el-table-column>
                                <el-table-column label="当前基金余额"  prop="balance" show-overflow-tooltip>
                                    <template slot-scope="scope">
                                        {{scope.row.balance | format1}}
                                    </template>
                                </el-table-column>
                            </el-table>
                        </el-row>
                        <el-row class="ca-m-t-20">
                            <div class="ca-table-header">
                                <span>3、基金投资明细</span>
                                <el-button type="primary" size="small" @click="exportExcel(17)" :disabled="!isAuthFundsDownload" class="ca-m-l-10">下载</el-button>
                            </div>
                            <el-table :data="ledgerFundInvestmentList" border class="table_p_01 ca-table">
                                <el-table-column label="序号" align="center">
                                    <template slot-scope="scope">{{scope.$index+1}}</template>
                                </el-table-column>
                                <el-table-column label="基金名称"  prop="fundName" show-overflow-tooltip></el-table-column>
                                <el-table-column label="投资类型"  prop="changedType" show-overflow-tooltip></el-table-column>
                                <el-table-column label="项目名称"  prop="itemName" show-overflow-tooltip></el-table-column>
                                <el-table-column label="付款日期"  prop="paymentTime"></el-table-column>
                                <el-table-column label="投资金额"  prop="amount" show-overflow-tooltip>
                                    <template slot-scope="scope">
                                        {{scope.row.amount | format1}}
                                    </template>
                                </el-table-column>
                                <el-table-column label="投资估值"  prop="valuation" show-overflow-tooltip>
                                    <template slot-scope="scope">
                                        {{scope.row.valuation | format1}}
                                    </template>
                                </el-table-column>
                                <el-table-column label="占股比例"  prop="proportion" show-overflow-tooltip>
                                    <template slot-scope="scope">
                                        {{scope.row.proportion | format2}}%
                                    </template>
                                </el-table-column>
                                <el-table-column label="所属行业"  prop="industry" show-overflow-tooltip></el-table-column>
                            </el-table>
                        </el-row>
                        <el-row class="ca-m-t-20">
                            <div class="ca-table-header">
                                <span>4、基金费用信息</span>
                                <el-button type="primary" size="small" @click="exportExcel(18)" :disabled="!isAuthFundsDownload" class="ca-m-l-10">下载</el-button>
                            </div>
                            <el-table :data="ledgerFundCostList" border class="table_p_01 ca-table">
                                <el-table-column label="序号" align="center"><template slot-scope="scope">{{scope.$index+1}}</template></el-table-column>
                                <el-table-column label="基金名称"  prop="fundName" show-overflow-tooltip></el-table-column>
                                <template v-for="cells in ledgerFundCostListOption">
                                    <el-table-column :key="cells.id"
                                                     :label="cells.name"
                                                     :prop="cells.id"
                                                     show-overflow-tooltip>
                                    </el-table-column>
                                </template>
                            </el-table>
                        </el-row>
                    </div>
                </el-tab-pane>
            </el-tabs>
        </div>
    </div>
</template>

<script type="text/ecmascript-6">
    import {api} from './api';
    import {STATUS_HTTP_SUCCESS, apiHttp} from '__service/csHttp';
    import { isNoAuth } from '__service/utils';
    export default {
        data() {
            return {
                //页面索引
                tabIndex: '0',
                initView: {
                    fundID_List: [],//基金下拉列表
                    projectID_List: [],//基金下拉列表
                    prostatusList: [{id: '', name: '全部'}, ...this.$store.state.user.dictionaryMap.prostatus],//投资阶段下拉列表
                    industryList: [{id: '', name: '全部'}, ...this.$store.state.user.dictionaryMap.industry],//行业分类下拉列表
                },
                investFundsParam: {
                    startTime: '',//成立时间-开始时间
                    endTime: '',//成立时间-结束时间
                    fundId: [],//基金id
                },
                projectParam: {
                    itemIds: [],//项目id
                    prostatus: '',//投资阶段 - 轮次
                    industry: '',//行业分类
                },
                fundName: '',//基金名称
                fundIdList: [],//基金tag标签上显示的
                projectTagList: [],//项目tag标签上显示的
                projectName: '',//项目名称
                projectData: [],//项目数据
                ledgerFundBaseList: [],//基金基本信息
                ledgerFundFinanceList: [],//基金财务信息
                ledgerFundInvestmentList: [],//基金投资明细
                ledgerFundCostList: [],//基金费用信息
                ledgerFundCostListOption: this.$store.state.user.dictionaryMap.fundCost,//基金费用列表字段
                isAuthItemDownload: isNoAuth('组合查询-已投资项目-下载'),
                isAuthFundsDownload: isNoAuth('组合查询-已设立基金-下载'),
                isAuthItemSee: isNoAuth('组合查询-已投资项目-查看'),
                isAuthFundsSee: isNoAuth('组合查询-已设立基金-查看'),
            }
        },
        watch: {
            'investFundsParam.startTime': function (val) {
                this.investFundsParam.startTime = val ? this.$moment(val).format('YYYY-MM-DD') : '';
            },
            'investFundsParam.endTime': function (val) {
                this.investFundsParam.endTime = val ? this.$moment(val).format('YYYY-MM-DD') : '';
            }
        },
        beforeRouteEnter(to, from, next) {
            next( vm => {
                if (!vm.isAuthItemSee && !vm.isAuthFundsSee) {
                    vm.$message({
                        message: '没有此页面的操作权限',
                        type: 'error',
                        center: true
                    });
                    vm.$router.replace({name: 'personal-center', params: {tabIndex: '0', openWindow: false}})
                }
            })
        },
        mounted() {
            if (!this.isAuthItemSee) {
                this.tabIndex = '1'
            }
            this.getInvestList();
            this.getInvestedProjectList();
        },
        methods: {
            // 获取基金名称列表
            async getInvestList() {
                let {resCode, data} = await apiHttp(api.INVESTING_FUNDS_LIST);
                if (resCode === STATUS_HTTP_SUCCESS) {
                    this.initView.fundID_List = data;
                    this.initView.fundID_List.unshift({
                        fundName: '全部',
                        id: ''
                    })
                }
            },
            // 获取项目名称列表
            async getInvestedProjectList() {
                let {resCode, data} = await apiHttp(api.INVESTED_PROJECT_LIST);
                if (resCode === STATUS_HTTP_SUCCESS) {
                    this.initView.projectID_List = data;
                    this.initView.projectID_List.unshift({
                        itemName: '全部',
                        itemId: ''
                    })
                }
            },
            // 查询基金表格数据
            async getInvestFundsList() {
                let fundIdList = this.investFundsParam.fundId.join(',');
                let {resCode, data} = await apiHttp(api.LEGER_FUNDS_LIST, {
                    startTime: this.investFundsParam.startTime,
                    endTime: this.investFundsParam.endTime,
                    fundId: fundIdList,
                });
                if (resCode === STATUS_HTTP_SUCCESS) {
                    this.ledgerFundBaseList = data.ledgerFundBaseList;
                    this.ledgerFundFinanceList = data.ledgerFundFinanceList;
                    this.ledgerFundInvestmentList = data.ledgerFundInvestmentList;
                    this.ledgerFundCostList = data.ledgerFundCostList;
                }
            },
            // 选择基金名称的 change event
            changeFund(val) {
                if (val) {
                    if (this.investFundsParam.fundId.indexOf(val) === -1 && this.investFundsParam.fundId.length < 10) {
                        this.investFundsParam.fundId.push(val);
                        this.initView.fundID_List.map(item=>{
                            if (item.id === val) {
                                this.fundIdList.push(item)
                            }
                        })
                    }
                } else {
                    this.fundIdList = [];
                    this.investFundsParam.fundId = [];
                }
            },
            // 选择项目名称的 change event
            changeProject(val) {
                if (val) {
                    if (this.projectParam.itemIds.indexOf(val) === -1 && this.projectParam.itemIds.length < 10) {
                        this.projectParam.itemIds.push(val);
                        this.initView.projectID_List.map(item=>{
                            if (item.itemId === val) {
                                this.projectTagList.push(item)
                            }
                        })
                    }
                } else {
                    this.projectTagList = [];
                    this.projectParam.itemIds = [];
                }
            },
            // 删除基金标签
            handleCloseFunds(item, index) {
                let tagIndex = this.investFundsParam.fundId.indexOf(item.id);
                this.investFundsParam.fundId.splice(tagIndex, 1);
                this.fundIdList.splice(index, 1);
            },
            // 删除项目标签
            handleCloseItem(item, index) {
                let tagIndex = this.projectParam.itemIds.indexOf(item.id);
                this.projectParam.itemIds.splice(tagIndex, 1);
                this.projectTagList.splice(index, 1);
            },
            // 查询项目表格数据
            async getProjectData() {
                let itemIdList = this.projectParam.itemIds.join(',');
                let {resCode, data} = await apiHttp(api.LEGER_ITEM_LIST, {
                    itemIds: itemIdList,
                    prostatus: this.projectParam.prostatus,//投资阶段 - 轮次
                    industry: this.projectParam.industry,//行业分类
                });
                if (resCode === STATUS_HTTP_SUCCESS) {
                    this.projectData = data;
                }
            },
            // 基金文件下载
            async exportExcel(type) {
                let fundIdList = this.investFundsParam.fundId.join(',');
                if ((type === 15 && this.ledgerFundBaseList.length === 0) ||
                    (type === 16 && this.ledgerFundFinanceList.length === 0) ||
                    (type === 17 && this.ledgerFundInvestmentList.length === 0) ||
                    (type === 18 && this.ledgerFundCostList.length === 0)
                ) {
                    this.$message({
                        type: 'warning',
                        message: '暂无数据'
                    })
                } else {
                    window.open(this.baseURL + api.DOWNLOAD_FILE.url + '?X-Token=' + this.$store.state.user.token + '&idList=' + fundIdList + '&type=' + type + '&name=' + '&itemNode=&prostatus=&fundType=' + '&guestId=' + '&startTime=' + this.investFundsParam.startTime + '&endTime=' + this.investFundsParam.endTime );
                }
            },
            // 已投资项目下载
            exportExcelItem(type) {
                let itemIdList = this.projectParam.itemIds.join(',');
                if (this.projectData.length === 0) {
                    this.$message({
                        type: 'warning',
                        message: '暂无数据'
                    })
                } else {
                    window.open(this.baseURL + api.DOWNLOAD_FILE.url + '?X-Token=' + this.$store.state.user.token + '&itemIds=' + itemIdList + '&prostatus=' + this.projectParam.prostatus + '&industry=' + this.projectParam.industry + '&type=' + type );
                }
            },
        },
        components: {
        }
    }
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
    .ca-p-t-7 {
        padding-top: 7px;
    }
    .ca-table-header{
        margin: 15px 0;
    }
    .ca-table-header>span {
        font-size: 16px;
    }
    .ca-advanced-btn {
        width: 300px;
    }
</style>
